<template>
  <div class="indexContainer">
    <div class="indexplan">
      <div class="indexTitle">
        <div class="titleBig">
          <img src="@/assets/img/label.png" alt="">
          <h2>专题推荐</h2>
        </div>
      </div>
      <div class="specialList">
        <el-empty :image-size="100" v-if="recommendData.length==0"  description="暂无数据"></el-empty>
        <ul>
          <li v-for="item in recommendData" :key="item.id" @click="handleDetail(item.id)">
            <i class="el-icon-data-line">{{item.name }}</i>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>
<script>
import {getQueryDictByCode} from "@/request/api/xxyd"
export default {
  components: {
  },
  data() {
    return {
      params:{
        code:'ztfl'
      },
      recommendData:[]
    };
  },
  created() {
      this.getSpecial()
  },
  methods: {
    //获取专题推荐
    getSpecial() {
      getQueryDictByCode(this.params).then(res => {
        if (res.data.code == 1) {
          this.recommendData = res.data.data.childList.slice(0,5)
        }
      })
    },
    // 查看详情
    handleDetail(id) {
      this.$router.push({
        name: "specialProduct",
        query: {
          id,
        },
      });
    },

  },
};
</script>
<style lang="less" scoped>
@import "./plan.less";
@import "../common.less";
</style>
